<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, minimum-scale=1.0, maximum-scale=1.0, initial-scale=1.0, user-scalable=no">
    <meta name="format-detection" content="telephone=no, email=no">
    <meta name="HandheldFriendly" content="true">
    <title></title>
    
    <link rel="stylesheet" href="./../../pay/wechat/css/frozenui.css">
    <link rel="stylesheet" href="./../../pay/wechat/css/style.css">
    <link href="https://fonts.googleapis.com/icon?family=Material+Icons"
      rel="stylesheet">
    <style>
    	.icon-tag {
		    font-family: 'icon-tag';
		}
		.ui-notice i:before {
    font-family: "icon-notice" !important;
    font-size: 32px;
    line-height: 46px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -webkit-text-stroke-width: 0.2px;
    display: block;
    color: rgba(0,0,0,0.5);
    content: none;
    font-size: 100px;
    line-height: 100px;
    color: rgba(0,0,0,0.3);
			
		}
    </style>

    
</head>
<script src="https://cdn.bootcss.com/vConsole/3.3.4/vconsole.min.js"></script>
<script src="//res.wx.qq.com/open/js/jweixin-1.4.0.js"></script>
<body ontouchstart>
    <section class="ui-container">
        <section id="notice">
            <h1 id="title" class="title"></h1>
            <div class="demo-item">
                <div class="demo-block">
                    <section class="ui-notice">
						<i id="icon" class="material-icons" style="font-size: 100px;color:#64bd63">
						
						</i>
                        <p id="desc"> </p>
                        <div class="ui-notice-btn">
                            <button id="done" class="ui-btn-primary ui-btn-lg" style="display: none;background-color: #f74c32;">完成</button>
                        </div>
                    </section>
                </div>
            </div>
        </section>
    </section>
    
    <script>
    new VConsole();
    (function() {
        const getcookie = (variable) =>{
            var arrStr = document.cookie.split("; ");
            for (var i = 0; i < arrStr.length; i++) {
                var temp = arrStr[i].split("=");
                if (temp[0] === variable){
                    return decodeURIComponent(temp[1]);
                }    
            }
            return(false)
        }
        const up = (variable) => {
            var arrStr = window.location.search.substring(1).split("&");// document.cookie.split("; ");
            for (var i = 0; i < arrStr.length; i++) {
                var temp = arrStr[i].split("=");
                if (temp[0] === variable){
                    return decodeURIComponent(temp[1]);
                }    
            }
            return(false)
        } 
        const gethl = (variable) => {
            var arrStr = window.location.search.substring(1).split("&");
            for (var i = 0; i < arrStr.length; i++) {
                var temp = arrStr[i].split("=");
                if (temp[0] === variable){
                    return decodeURIComponent(temp[1]);
                }    
            }
            return "zh_cn"
        }
        const domain = "//127.0.0.1"
        window.onload = function (){
            let title = document.getElementById("title")
            let desc = document.getElementById("desc")
            let icon = document.getElementById("icon")
            let done = document.getElementById("done")

            done.addEventListener("click",function(){
            	let h = domain + up('calluri')
            	console.log(h)
                window.location.href = h+"?order_no="+ up('order_no')
            })
            // 初始化
            function pageinit(t, d, i, de){
                title.innerText = t
                desc.innerText = d
                icon.innerText = i
                done.innerText = de
            }
            pageinit("正在发起支付","努力加载中","access_time","请等待")
            let order_no = up("order_no")
            let calluri = up("calluri")
            if(!order_no || !calluri){
                pageinit("错误","发生错误","access_time","返回")
                done.style.display = "block"
                return
            }
            fetch(domain+'/api/sdk/wechat/jssdk?sdk_uri='+encodeURIComponent(window.location.href), {
                headers: {
                    'authtoken': getcookie("authtoken"),
                    'content-type': 'application/json'
                },
                body: JSON.stringify({}), // must match 'Content-Type' header
                method: 'POST', // *GET, POST, PUT, DELETE, etc.
                mode: 'cors', // no-cors, cors, *same-origin
                redirect: 'follow', // manual, *follow, error
                referrer: 'no-referrer', // *client, no-referrer
            })
            .then((res)=> res.json())
            .then((res)=>{
                if( res.code === 1 ){
                    wecatConfig(res)
                }else{
                    console.log(pageinit("支付失败","支付失败","cancel","返回")) 
                    done.style.display = "block"
                    if(confirm("支付失败,是否前往订单页查看")){
                        window.location.href = domain + "/order/management"
                    }
                }
            })
            .catch((res)=> {
                console.log(pageinit("支付失败","支付失败","cancel","返回"))
                done.style.display = "block"
                if(confirm("支付失败,是否前往订单页查看")){
                    window.location.href = domain + "/order/management"
                }
            })

            const wecatConfig = (res) => {
            wx.config({
                debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
                appId: res.data.app_id, // 必填，公众号的唯一标识
                timestamp: res.data.timestamp, // 必填，生成签名的时间戳
                nonceStr: res.data.nonce_str, // 必填，生成签名的随机串
                signature: res.data.signature,// 必填，签名
                jsApiList: [
                    "chooseWXPay"
                ] // 必填，需要使用的JS接口列表
            });
            wx.ready(function(){
                // 微信配置就绪后
                console.log("wxsdk is ok")
                fetch(domain+'/api/pay/wechat/jsapi?order_no='+ up("order_no") + '&notify_url='+ domain+"/api/member/order/notify", {
                    headers: {
                        'authtoken': getcookie("authtoken"),
                        'content-type': 'application/json'
                    },
                    body: JSON.stringify({}), // must match 'Content-Type' header
                    method: 'POST', // *GET, POST, PUT, DELETE, etc.
                    mode: 'cors', // no-cors, cors, *same-origin
                    redirect: 'follow', // manual, *follow, error
                    referrer: 'no-referrer', // *client, no-referrer
                })
                .then((res)=> res.json())
                .then((res)=>{
                    if(res.code==1){
                    	function onBridgeReady(){
						   WeixinJSBridge.invoke(
						      'getBrandWCPayRequest', {
						         "appId":res.data.AppID,     //公众号名称，由商户传入     
						         "timeStamp":""+res.data.Timestamp,        //时间戳，自1970年以来的秒数     
						         "nonceStr": res.data.NonceStr, //随机串     
						         "package":res.data.Package,     
						         "signType": res.data.SignType,      //微信签名方式：     
						         "paySign": res.data.Sign, //微信签名 
						      },
						      function(res){
                                  alert(res.err_msg)
                                  console.log(res)
						      if(res.err_msg == "get_brand_wcpay_request:ok" ){
						      // 使用以上方式判断前端返回,微信团队郑重提示：
						            //res.err_msg将在用户支付成功后返回ok，但并不保证它绝对可靠。
						            fetch(domain+'/api/order/status?order_no='+ up("order_no")+"&hl="+gethl("hl"), {
                                        headers: {
                                            'authtoken': getcookie("authtoken"),
                                        },
                                        method: 'POST', // *GET, POST, PUT, DELETE, etc.
                                        mode: 'cors', // no-cors, cors, *same-origin
                                        redirect: 'follow', // manual, *follow, error
                                        referrer: 'no-referrer', // *client, no-referrer
                                    })
                                    .then((res)=> res.json())
                                    .then((res)=>{
                                        if(res.code==1){
                                            console.log(pageinit("支付成功","您已支付成功","check_circle","完成"))
                                            done.style.display = "block"
                                        }
                                    })
						      }else{
                                console.log(pageinit("支付失败","支付失败","cancel","返回"))
                                done.style.display = "block"
                                if(confirm("支付失败,是否前往订单页查看")){
                                    window.location.href = domain + "/order/management"
                                }
						      }
						   }); 
						}
						if (typeof WeixinJSBridge == "undefined"){
						   if( document.addEventListener ){
						       document.addEventListener('WeixinJSBridgeReady', onBridgeReady, false);
						   }else if (document.attachEvent){
						       document.attachEvent('WeixinJSBridgeReady', onBridgeReady); 
						       document.attachEvent('onWeixinJSBridgeReady', onBridgeReady);
						   }
						}else{
						   onBridgeReady();
						}
                    }else{
                        console.log(pageinit("支付失败",res.err,"cancel","返回")) 
                        done.style.display = "block"
                    }
                })
            })
        }
    }
})();
    </script>

    <!-- https://res.wx.qq.com/open/js/jweixin-1.4.0.js
    <script
    src="https://code.jquery.com/jquery-3.4.1.slim.js"
    integrity="sha256-BTlTdQO9/fascB1drekrDVkaKd9PkwBymMlHOiG+qLI="
    crossorigin="anonymous"></script>
    <script src="./../../pay/wechat/js/lib/zepto.min.js"></script>
    <script src="./../../pay/wechat/js/index.js"></script>
    -->
    
    

    
</body>
</html>
